﻿    .barcontainer {position:absolute; left:0; top:0;, height: auto; }
 /* BAR CHART */
    .bar { list-style:none; margin:0px 0 0 0px; width:50px; }
    .bar li { margin-top:-20px; }

    /* First top should have a different colour */
    .bar li:first-child div.top { background-color:rgba(186,211,215,0.5); }

    /* Last bottom should have a shadow */
    /*.bar li:last-child div.bottom { -moz-box-shadow: 0 10px 10px hsla(0,0%,0%,.2); -webkit-box-shadow: 0 100px 30px hsla(0,0%,0%,.2); box-shadow: 0 100px 30px hsla(0,0%,0%,.2); }*/

    /* Ellipse top */
    .bar li div.top { background-color:rgba(140,172,176,0.5); position:relative;
	    width:50px; height:20px; -moz-border-radius: 50px/20px; -webkit-border-radius: 50px 20px; border-radius: 50px/20px; }
    .bar li div.top img { margin-left:18px; margin-top:-32px; display:none; }

    /* Bar bottom */
    .bar li div.bottom { background-color:rgba(184,203,205,0.5); margin-top:-20px; position:relative;
	    width:50px; -moz-border-radius: 50px/20px; -webkit-border-radius: 50px 20px; border-radius: 50px/20px; }
    .bar li div.bottom div.infobox { padding:40px 0 0 200px; }
    .bar li div.bottom div.infobox h3 { font-family:Georgia,serif,Times; }
    .bar li div.bottom div.infobox p { font-family:"Lucida Grande",Arial,Helvetica,Sans-Serif; }

    /* General hover actions */
    .bar li:hover div.top img { display:inline; }
    .bar li:hover div.bottom div.infobox { color:#eee; text-shadow: 0px 5px 5px #111; }

    /* error bar */
    .barerror div.top { z-index:1000; }
    .barerror div.bottom
    {
        height: 75px;
        z-index: 996;
        background-color: #FF0000;
        background: -moz-linear-gradient(-90deg, #FF0000, #FF0000);
        background: -webkit-gradient(linear, 0 top, 0 bottom, from(#FF0000), to(#FF0000));
        
    }

/* iPod bar */
.barwarning div.top { z-index:1000; }
.barwarning div.bottom
{
    height: 75px;
    z-index: 994;
    background-color: #FFCC00;
    background: -moz-linear-gradient(-90deg, #FFCC00, #FFCC00);
    background: -webkit-gradient(linear, 0 top, 0 bottom, from(#FFCC00), to(#FFCC00));
}

/* success Display bar */
.barsuccess div.top { z-index:1000; }
.barsuccess div.bottom
{
    height: 75px;
    z-index: 992;
    background-color: #009900;
    background: -moz-linear-gradient(-90deg, #009900, #009900);
    background: -webkit-gradient(linear, 0 top, 0 bottom, from(#009900), to(#009900));
}

.barbase {/*margin-top:-70px; position:relative;*/ margin-top:-52px; margin-left:-33px; z-index:-999; }
.barbase p { float:left; margin-top:0px; }